<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="../css/base.css">
  <link rel="stylesheet" href="../css/nav.css">
  <link rel="stylesheet" href="../css/profile.css">
  <title>用户中心</title>
</head>
<body onload="iniProfile()">
  <div class="header">
    <div class="header-content">
      <div class="logo">
        小A论坛
      </div>
      <div>
        <ul class="nav">
          <li><a href="../index.html">首页</a></li>
<!--           <li onclick="getTopNewsPage()"><a>热榜</a></li> -->
          <div class="underline index"></div>
        </ul>
      </div>
      <div class="search-bar" style="visibility: hidden;">
        <input type="text" name="search" value="" placeholder="搜索论坛内容..." autocomplete="off">
        <button type="button" name="searchBtn" class="primary medium" onclick="search()">搜索</button>
      </div>
      <div class="account">
        <div class="profile"></div>
      </div>
    </div> 
  </div>
  <div class="main">
    <div class="horizontal-nav">
      <img src="../img/user-icon.png" alt="头像" class="user-icon">
      <span class="username"></span>
      <div class="change-icon">
        <button class="primary large">更换头像</button>
        <input class="change-icon" type="file" name="icon"/>
      </div>
      <ul class="horizontal">
        <li class="active"><a href="index.html">账号信息 ></a></li>
        <li><a href="my-news.html">我的动态 ></a></li>
        <li><a href="album.html">我的相册 ></a></li>
      </ul>
      <button type="button" class="danger full" onclick="logOut()">退出登录</button>
    </div>
    <div class="main-content">
      <div>
        <h2>账号信息</h2>
        <div class="content">
          <div>
            <h3>邮箱</h3>
            <div class="input-bar">
              <input type="text" name="email-show" disabled/>
              <button type="button" class="primary medium" name="email-btn" onclick="setInfo('email')">更改邮箱</button>  
            </div>
          </div>
          <div>
            <h3>用户名</h3>
            <div class="input-bar">
              <input type="text" name="username-show" disabled/>
              <button type="button" class="primary medium" name="username-btn" onclick="setInfo('username')">更改用户名</button>  
            </div>
          </div>
          <div>
            <h3>密码</h3>
            <div class="input-bar">
              <input type="password" value="**********" disabled/>
              <button type="button" class="primary medium" onclick="changePasswordPage('open')">更改密码</button>  
            </div>
          </div>
          <div>
            <h3>手机号</h3>
            <div class="input-bar">
              <input type="phone" name="phone-show" disabled/>
              <button type="button" class="primary medium" name="phone-btn" onclick="setInfo('phone')">更改手机号</button>  
            </div>
          </div>
          <div>
            <h3>性别</h3>
            <div class="input-bar">
              <input type="radio" name="sex" value="男"/>男
              <input type="radio" name="sex" value="男"/>女
            </div>
          </div>
          <div>
            <h3>年龄</h3>
            <div class="input-bar">
              <input type="number" name="age-show" disabled>
              <button type="button" class="primary medium" name="age-btn" onclick="setInfo('age')">更改年龄</button>  
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <script src="../js/operation.js"></script>
  <script src="../js/profile.js"></script>
</body>
</html>